<template>
  <div class="mat-reference">
    <a target="_blank" :href="gushiwen">
      <ri i="elink"></ri>
      古诗文网</a>
    <a target="_blank" :href="baiduhanyu">
      <ri i="elink"></ri>
      百度汉语</a>
  </div>
</template>

<script>
export default {
  props: ["title"],
  computed: {
    gushiwen() {
      let esc = encodeURIComponent(this.title);
      return "https://so.gushiwen.org/search.aspx?value=" + esc;
    },
    baiduhanyu() {
      let esc = encodeURIComponent(this.title);
      return "https://hanyu.baidu.com/s?from=poem&wd=" + esc;
    },
  },
};
</script>

<style lang="stylus">
.mat-reference
  font-size 0.9em

  >a
    margin-right 20px
    padding 0
    color #409EFF
    text-decoration underline

    .icon-button
      font-size 1em
      margin-top 1px
      padding-top 2px
      margin-left 0
      line-height 22px
      height 22px margin-right 20px

</style>